@/*
    图片上传参数的说明:
    name : 名称
    id : 头像的id
@*/
@if(isEmpty(accept)){
@	accept=null;
@}
@if(isEmpty(value)){
@	value=null;
@}
<style type="text/css">
    video::-webkit-media-controls{
        display:none !important;
    }
</style>
<div class="form-group">
    @if(!isEmpty(name)){
    <label class="lab head-scu-label">${name}</label>
    @}
    <div class="ele ${isEmpty(name)?'ele-fit':''}">
        <div id="${id}_Id" style="float: left;">
            <div>
                <img width="100px" height="100px" src="${ctxPath}/static/common/img/webuploader.png" id="imgId">
                <video width="100px" height="100px" controls style="display: none" id="${id}_video">
                     <source src="${ctxPath}/file/image/${value}"  id="${id}videoId">
                 </video>
            </div>
        </div>
        <div class="head-scu-btn upload-btn" id="${id}BtnId" style="float: left;">
            <i class="fa fa-upload"></i>&nbsp;上传
        </div>
	    <input type="hidden" id="${id}" value="${value!}"/>
		@if(isNotEmpty(tips)){
	        <span class="help-block m-b-none">${tips!}</span>
		@}
    </div>
</div>
@if(isNotEmpty(underline) && underline == 'true'){
    <div class="hr-line-dashed"></div>
@}
<div id="${id}_progressBar" class="progress progress-striped progressBar">
	<div style="width: 0%" aria-valuemax="100" aria-valuemin="0" aria-valuenow="0" role="progressbar" class="progress-bar progress-bar-info ">
	</div>
</div>

<script>
    function setVideoPath(response) {
        $("#imgId").hide();
        $("#${id}_video").show();
        document.getElementById("${id}_video").src="${ctxPath}/file/image/" + response ;
    }

$(function () {
    var _wu_${id} = new $WebUpload("${id}");
    _wu_${id}.setUploadAccept(${accept});
    _wu_${id}.setUploadCompleteEvent(setVideoPath);
    _wu_${id}.init();
    if(${value != null}){
        $("#imgId").hide();
        $("#${id}_video").show();
    }
});
</script>